<template>
  <a-modal
    title='公开分享'
    :destroyOnClose=true
    :width="modalWidth"
    :visible="visible"
    :maskClosable="false"
    @ok="onClose"
    @cancel="onClose"
  >

    <a-form-model
      ref="DatasourcePermissionForm"
      :model="reportObj"
      :label-col="{ span: 4 }"
      :wrapper-col="{ span: 20 }"
    >
      <a-form-model-item label="分享状态" prop="status">
        <a-switch
          checked-children="开"
          un-checked-children="关"
          :checked="sharedStatus"
          :loading="loading"
          @change="changeSharedStatus"/>
      </a-form-model-item>
      <a-form-model-item label="公共链接" prop="link">
        <a-input-search style="width: 80%" :value="link" @search="doCopy">
          <a-button
            :disabled="copyDisabled"
            icon="copy"
            type="primary"
            slot="enterButton"
            block
          >复制链接</a-button>
        </a-input-search>
      </a-form-model-item>
    </a-form-model>
  </a-modal>
</template>

<script>
import {mapActions} from "vuex";
import {isEmptyString} from "@/utils/util";
import storage from "store";
import {REFRESH_TOKEN} from "@/store/mutation-types";

const publicPathRegx = new RegExp(/^(\/.*)?\/system\/report.*?/);

export default {
  name: "PublicSharingModal",
  props: {
    visible: Boolean,
    reportObj: Object
  },
  watch:{
    visible (){
      if (this.visible){
        this.getSharedInfo()
      }
    }
  },
  computed: {
    publicPath (){
      let path = ""
      const regArray = publicPathRegx.exec(window.location.pathname)
      if (regArray && regArray.length >= 2){
        path = regArray[1]
      }
      return path
    },
    copyDisabled(){
      return isEmptyString(this.sharedKey) || this.sharedKey.length < 1
    }
  },
  data (){
    return {
      modalWidth: 800,
      loading: false,
      sharedStatus: false,
      sharedKey: "",
      link: "",
      baseLink: window.location.host + this.publicPath + "/public/report/"
    }
  },
  methods: {
    ...mapActions('reportManage', ['getSharedKey','addSharedKey','deleteSharedKey']),
    onClose () {
      this.$emit('closePublicSharingModal')
    },
    doCopy (){
      this.$copyText(this.link).then(() => {
        this.$message.success('链接已复制到剪贴板')
      })
    },
    getSharedInfo (){
      if (!this.reportObj || !this.reportObj.id){
        return
      }
      this.getSharedKey(this.reportObj.id).then(res => {
        this.loading = true
        if (res && res.code === 0){
          this.sharedKey = res.data.key
          this.sharedStatus = true
          this.link = "http://" + window.location.host + this.publicPath + "/public/report/" + this.reportObj.id + "?key=" + this.sharedKey
        }else {
          this.sharedStatus = false
          this.link = ""
        }
      }).finally(()=>{
        this.loading = false
      })
    },
    changeSharedStatus (flag){
      this.loading = true
      let refreshToken = storage.get(REFRESH_TOKEN)
      if (flag && this.reportObj && this.reportObj.id && refreshToken){
          this.addSharedKey({reportId: this.reportObj.id, token: refreshToken}).then(res=>{
            this.sharedStatus = true
            this.sharedKey = res.key
            this.link = "http://" + window.location.host + this.publicPath + "/public/report/" + this.reportObj.id + "?key=" + this.sharedKey
            this.$message.success('报表分享链接创建成功!')
          }).catch(err=>{
            this.link = ""
            console.error(err)
            this.$message.error("报表分享链接创建失败: " + err)
          }).finally(()=>{
            this.loading = false
          })
      }else if (!flag && this.reportObj && this.reportObj.id && this.sharedKey && this.sharedKey !== ""){
        this.deleteSharedKey({reportId: this.reportObj.id, key: this.sharedKey}).then(()=>{
          this.sharedStatus = false
          this.sharedKey = ""
          this.link = ""
          this.$message.success('报表分享关闭成功!')
        }).catch(err=>{
          console.error(err)
          this.$message.error("报表分享关闭失败: " + err)
        }).finally(()=>{
          this.loading = false
        })
      }else {
        this.loading = false
      }
    }
  }
}
</script>

<style scoped>

</style>
